<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script type="text/javascript">
		window.onload =function () {
			// body...
			var oDiv = document.getElementById("div1");
			var oBtn01 = document.getElementById("btn01");
			var oBtn02 = document.getElementById("btn02");
			oDiv.title = "你好";
			oDiv.style.color = "red";
			oDiv.style.fontSize = "20px";

			oDiv.onclick = myalert;
			oBtn01.onclick = change01;
			oBtn02.onclick = change02;

			function myalert(){
				alert("ok!");
			}

			function change01(){
				oDiv.className = "box01";
			}
			function change02(){
				oDiv.className = "box02";
			}
		}

	</script>
	<style type="text/css">
		.box01{
			width: 200px;
			height: 200px;
			background-color: gold;
		}

		.box02{
			width: 200px;
			height: 200px;
			background-color: pink;
		}

	</style>
</head>
<body>
	<input type="button" name="" value= "1" id= "btn01">
	<input type="button" name="" value= "2" id= "btn02">
	<div id="div1" class="box01">这是一个DIV元素!</div>
</body>
</html>